<template>
    <view class="" style="position: relative;">
        <view class="ceiling" :style="{ 'padding-top': statusBarHeight + 'px' }"
            style="position: absolute;top: 0;z-index: 999;width: 100%;background-color: transparent;">
            <searchHead background='transparent' inputStyle='background-color:rgba(255, 255, 255, 0.12)'
                placeholderTxt="股票/资讯/功能" placeholderStyle="color:#FFFFFF"></searchHead>
        </view>
        <!-- banner -->
        <!-- //首页轮播图，配置路径 /static/banner/  默认高度为420rpx 750X420-->
        <view class="bannerBox">
            <view class="bannerImgBox">
                <view class="uni-margin-wrap">
                    <swiper class="swiper" circular :indicator-dots="indicatorDots" :autoplay="autoplay"
                        :interval="interval" :duration="duration">
                        <swiper-item>
                            <view class="swiper-item">
                                <image src="/static/banner/1.png"></image>
                            </view>
                        </swiper-item>
                        <swiper-item>
                            <view class="swiper-item">
                                <image src="/static/banner/2.png"></image>
                            </view>
                        </swiper-item>
                        <swiper-item>
                            <view class="swiper-item">
                                <image src="/static/banner/3.png"></image>
                            </view>
                        </swiper-item>
                        <swiper-item>
                            <view class="swiper-item">
                                <image src="/static/banner/4.png"></image>
                            </view>
                        </swiper-item>
                        <swiper-item>
                            <view class="swiper-item">
                                <image src="/static/banner/5.png"></image>
                            </view>
                        </swiper-item>
                        <swiper-item>
                            <view class="swiper-item">
                                <image src="/static/banner/banner.png"></image>
                            </view>
                        </swiper-item>
                    </swiper>
                </view>
            </view>
        </view>
        <!-- 分类 -->

        <!-- 中间的通知块 -->
        <view class="flex volumeBox" style="align-items: center;">
            <!-- 日历 展示 开始 -->
            <view class="myRiLi">
                <dateView></dateView>
            </view>
            <!-- 日历 展示 结束 -->
            <!-- 左边的小喇叭，需要替换的话注意下分辨率40x40 -->
            <image v-if="NewSharesData.length==0" src="/static/images/newIcon/volume.png" mode="widthFix"
                style="height: 50rpx;width: 40rpx;margin-right: 12rpx;"></image>
            <!-- 右边的文本 可以多行，默认和左边的小喇叭居中对齐-->
            <text v-if="NewSharesData.length==0" style="color: #666666;height: 50rpx;">今日新股：暂无新股,敬请期待！</text>

            <!-- 有数据后 -->
            <view class="notice" v-if="NewSharesData.length" style="hbackground-color: #9bf;">
                <swiper class="swiper-nav" :circular="true" :autoplay="true" :interval="1000" :duration="1000"
                    :vertical="true" :display-multiple-items="1" style="height: 50rpx;background-color: #FFFFFF;">
                    <swiper-item style="display: flex;" v-for="(item,index) in NewSharesData" :key="index">
                        <image src="/static/images/newIcon/volume.png" mode="widthFix"
                            style="width: 40rpx; line-height: 40rpx; margin-right: 12rpx;"></image>
                        <text style="color: #666666; line-height: 40rpx;">今日新股：{{item.name}} 申购代码：{{item.code}}</text>
                    </swiper-item>
                </swiper>
            </view>

        </view>
        <!-- 分割线 -->
        <view style="width: 100vw;height: 12rpx;background-color: #FBFBFB;"></view>

        <!-- icon 配置路径 /static/images/newIcon/  同名替换即可  分辨率 80X80-->
        <template>
            <view>
                <view class="uni-padding-wrap">
                    <view class="page-section swiper">
                        <view class="page-section-spacing">
                            <swiper class="swiper" indicator-dots="true" indicator-color="#ccc" indicator-active-color="#83aeff" duration="1000" style="height: 320rpx;">
                                <swiper-item>
                                    <view class="center">
                                        <view class="flex-f1 center  flex-ver"
                                            @click="tonavigateTo('/pages/gzHangYe/index?c=1&name=上证指数&code=SH000001')">
                                            <image class="iconImg" src="/static/images/newestIcon/price.png"
                                                mode="widthFix" style="width: 80rpx;"></image>
                                            <text class="classifyText">上证指数</text>
                                        </view>
                                        <view class="flex-f1 center  flex-ver"
                                            @click="tonavigateTo('/pages/public/arcticle/list?type=1')">
                                            <image class="iconImg" src="/static/images/newestIcon/news.png"
                                                mode="widthFix" style="width: 80rpx;"></image>
                                            <text class="classifyText">市场要闻</text>
                                        </view>
                                        <view class="flex-f1 center flex-ver" @click="toTrade">
                                            <image class="iconImg" src="/static/images/newestIcon/index.png"
                                                mode="widthFix" style="width: 80rpx;"></image>
                                            <text class="classifyText">买入/卖出</text>
                                        </view>
                                        <view class="flex-f1 center  flex-ver"
                                            @click="tonavigateTo('/pages/public/newShare/newShare?tabIndex=1')">
                                            <image class="iconImg" src="/static/images/newestIcon/Subscribe.png"
                                                mode="widthFix" style="width: 80rpx;"></image>
                                            <text class="classifyText">一键打新</text>
                                        </view>
                                        <view class="flex-f1 center  flex-ver" @click="downApp()">
                                            <image class="iconImg" src="/static/images/newestIcon/downloads.png"
                                                mode="widthFix" style="width: 80rpx;"></image>
                                            <text class="classifyText">{{appText}}</text>
                                        </view>

                                    </view>
                                    <view class="center">
                                        <view class="flex-f1 center  flex-ver"
                                            @click="tonavigateTo('/pages/public/about/about')">
                                            <image class="iconImg" src="/static/images/newestIcon/about.png"
                                                mode="widthFix" style="width: 80rpx;"></image>
                                            <text class="classifyText">关于我们</text>
                                        </view>
                                        <view class="flex-f1 center  flex-ver"
                                            @click="tonavigateTo('/pages/public/arcticle/list?type=2')">
                                            <image class="iconImg" src="/static/images/newestIcon/dynamic.png"
                                                mode="widthFix" style="width: 80rpx;"></image>
                                            <text class="classifyText">汇丰资讯</text>
                                        </view>
                                        <view class="flex-f1 center  flex-ver" @click="tonavigateTo('/pages/member/recharge')">
                                            <image class="iconImg" src="/static/images/newestIcon/transfer.png"
                                                mode="widthFix" style="width: 80rpx;"></image>
                                            <text class="classifyText">银证转账</text>
                                        </view>
                                        <view class="flex-f1 center  flex-ver"
                                            @click="tonavigateTo('/pages/OtherPages/economicdata')">
                                            <image class="iconImg" src="/static/images/newestIcon/exponent.png"
                                                mode="widthFix" style="width: 80rpx;"></image>
                                            <text class="classifyText">经济数据</text>
                                        </view>
                                        <view class="flex-f1 center  flex-ver" @click="customer">
                                            <image class="iconImg" src="/static/images/newestIcon/Customer.png"
                                                mode="widthFix" style="width: 80rpx;"></image>
                                            <text class="classifyText">在线客服</text>
                                        </view>
                                    </view>
                                </swiper-item>
                                <swiper-item>
                                    <view class="center">
                                        <view class="flex-f1 center flex-ver" @click="tonavigateTo('/pages/OtherPages/bxzj')">
                                            <image class="iconImg" src="/static/images/newestIcon/beixiang2.png"
                                                mode="widthFix" style="width: 80rpx;"></image>
                                            <text class="classifyText">北向资金</text>
                                        </view>

                                        <view class="flex-f1 center flex-ver"
                                            @click="tonavigateTo('/pages/OtherPages/zhuiZhang')">
                                            <image class="iconImg" src="/static/images/newestIcon/jigou2.png"
                                                mode="widthFix" style="width: 80rpx;"></image>
                                            <text class="classifyText">机构抢筹</text>
                                        </view>

                                        <view class="flex-f1 center  flex-ver"
                                            @click="tonavigateTo('/pages/OtherPages/mainforce')">
                                            <image class="iconImg" src="/static/images/newestIcon/zhuli2.png"
                                                mode="widthFix" style="width: 80rpx;"></image>
                                            <text class="classifyText">主力排行</text>
                                        </view>

                                        <view class="flex-f1 center flex-ver"
                                            @click="tonavigateTo('/pages/OtherPages/shareswin')">
                                            <image class="iconImg" src="/static/images/newestIcon/riqi2.png"
                                                mode="widthFix" style="width: 80rpx;"></image>
                                            <text class="classifyText">中签日期</text>
                                        </view>

                                        <view class="flex-f1  center flex-ver"
                                            @click="tonavigateTo('/pages/OtherPages/turnover?status=true')">
                                            <image class="iconImg" src="/static/images/newIcon/huanshou2.png"
                                                mode="widthFix" style="width: 80rpx;"></image>
                                            <text class="classifyText">换手率</text>
                                        </view>

                                    </view>
                                    <view class="center">
                                        <view class="flex-f1  center flex-ver"
                                            @click="tonavigateTo('/pages/OtherPages/datl?status=true')">
                                            <image class="iconImg" src="/static/images/newIcon/longhu2.png"
                                                mode="widthFix" style="width: 80rpx;"></image>
                                            <text class="classifyText">龙虎榜</text>
                                        </view>
                                          <!-- 站位 不然样式不对齐 -->
                                        <view class="flex-f1  center flex-ver">
                                        </view>
                                        <view class="flex-f1  center flex-ver">
                                        </view>
                                        <view class="flex-f1  center flex-ver">
                                        </view>
                                        <view class="flex-f1  center flex-ver">
                                        </view>
                                        
                                    </view>
                                </swiper-item>
                            </swiper>
                        </view>
                    </view>
                </view>

            </view>
        </template>

        <!-- AD 后海资讯那张背景图片 分辨率比例最好一样（高宽比）  文本做了单行溢出处理-->
        <view class="AD" style="background-color: #FFFFFF;">
            <view class="AD-bg">
                <image src="/static/images/AD-bg.png" mode="widthFix" style="width: 100%;"></image>
            </view>
            <!-- 下面行内样式的高度控制滚动高度 -->
            <view class="AD-txt flx flx-col" style="overflow: hidden;position: absolute;height: 170rpx;"
                @click="tonavigateTo('/pages/public/arcticle/kuaiXun')">
                <!--duration:滑动时长    vertical:方向:T垂直 F横向   circular:是否循环  interval:间隔-->
                <view class="notice" v-if="news3.length" style="background-color: #9bf;">
                    <swiper class="swiper-nav" :circular="true" :autoplay="true" :interval="1000" :duration="1000"
                        :vertical="true" :display-multiple-items="3" style="height: 175rpx;background-color: #FFFFFF;">
                        <!-- 上面行内样式的高度控制整体间距 -->
                        <swiper-item style="display: table;" v-for="(item,index) in news3" :key="index">
                            <view style="width: 140rpx;display: table-cell;vertical-align: middle;" class="right item">
                                <text class="sp">资讯</text>{{item.C.substr(0,16)}}
                            </view>
                        </swiper-item>
                    </swiper>
                </view>
                <!-- <view class="item" v-for="(item, index) in news" :key="index"><text class="sp">资讯</text>{{item.C.substr(0,16)}}</view> -->
            </view>
        </view>

        <!-- 涨幅 -->
        <view class="gainsBox">
            <view class="center bb pb10">
                <view class="c-red fz13">看多{{showTip.v1}}</view>
                <view class="gainsProgressBox flex-f1 center">
                    <view class="bg-red gainsProgress" :style="{'width':showTip.sv1}"></view>
                    <view class="bg-cb gainsProgress gainsProgressCenter" :style="{'width':showTip.sv3}"></view>
                    <view class="bg-green gainsProgress" :style="{'width':showTip.sv2}"></view>
                </view>
                <view class="c-green fz13">看空{{showTip.v2}}</view>
            </view>
            <view class="exponent start" @click="toInfo(shangZheng)">
                <view class='fz14 c66 mr20'>上证指数：</view>
                <view class='fz14 c-red' :class="shangZheng.P>shangZheng.YC?'':'c37A037'">{{shangZheng.P}}</view>
                <view class='fz14 c-red flex-f1 tx-c' :class="shangZheng.P>shangZheng.YC?'':'c37A037'">
                    {{(shangZheng.P-shangZheng.YC).toFixed(2)}}</view>
                <view class='fz14 c-red mr10' :class="shangZheng.P>shangZheng.YC?'':'c37A037'">
                    {{((shangZheng.P-shangZheng.YC) *10/shangZheng.YC *10) .toFixed(2)}}%</view>
            </view>
        </view>
        <!--  动态-->

        <!-- 增加个风口采集 开始 -->
        <view class="margin-bottom-sm bg_FFFFFF padding-tb-xs">
            <view class="margin-bottom-sm bg_FFFFFF padding-tb-xs">
                <swiper :autoplay="true" :interval="3000" :duration="1000" style="height: 198upx;">
                    <swiper-item>
                        <view class="flex" style="padding: 0 6rpx;">
                            <!-- swiper 1 开始 -->
                            <view class="flex-sub exponent-item padding-tb-sm radius text-center"
                                style="background-color: #EB5149;">
                                <view class="text-white text-bold">上证指数</view>
                                <view class="text-white text-bold text-xl margin-tb-xs cE02C3A">{{shangZheng.P}}</view>
                                <view class="text-white text-sm">
                                    <text class="cE02C3A">{{(shangZheng.P-shangZheng.YC).toFixed(2)}}</text>
                                    <text
                                        class="margin-left-xs cE02C3A">{{((shangZheng.P-shangZheng.YC) *10/shangZheng.YC *10) .toFixed(2)}}%</text>
                                </view>
                                <view class="gainsProgressBox flex-f1 center margin-top-xs">
                                    <view class="bg-red gainsProgress" :style="{'width':'80px'}"></view>
                                    <view class="bg-cb gainsProgress gainsProgressCenter" :style="{'width':'5px'}">
                                    </view>
                                    <view class="bg-green gainsProgress" :style="{'width':'15px'}"></view>
                                </view>
                            </view>
                            <!-- swiper 1 结束 -->
                            <!-- swiper 1 开始 -->
                            <view class="flex-sub exponent-item padding-tb-sm radius text-center"
                                style="background-color: #63C167;">
                                <view class="text-white text-bold">创业板指</view>
                                <view class="text-white text-bold text-xl margin-tb-xs cE02C3A">{{chuangYe.P}}</view>
                                <view class="text-white text-sm">
                                    <text class="cE02C3A">{{(chuangYe.P-chuangYe.YC).toFixed(2)}}</text>
                                    <text
                                        class="margin-left-xs cE02C3A">{{((chuangYe.P-chuangYe.YC) *10/chuangYe.YC *10) .toFixed(2)}}%</text>
                                </view>
                                <view class="gainsProgressBox flex-f1 center margin-top-xs">
                                    <view class="bg-red gainsProgress" :style="{'width':'80px'}"></view>
                                    <view class="bg-cb gainsProgress gainsProgressCenter" :style="{'width':'5px'}">
                                    </view>
                                    <view class="bg-green gainsProgress" :style="{'width':'15px'}"></view>
                                </view>
                            </view>
                            <!-- swiper 1 结束 -->
                            <!-- swiper 1 开始 -->
                            <view class="flex-sub exponent-item padding-tb-sm radius text-center"
                                style="background-color: #63C167;">
                                <view class="text-white text-bold">深证成指</view>
                                <view class="text-white text-bold text-xl margin-tb-xs cE02C3A">{{shenZheng.P}}</view>
                                <view class="text-white text-sm">
                                    <text class="cE02C3A">{{(shenZheng.P-shenZheng.YC).toFixed(2)}}</text>
                                    <text
                                        class="margin-left-xs cE02C3A">{{((shenZheng.P-shenZheng.YC) *10/shenZheng.YC *10) .toFixed(2)}}%</text>
                                </view>
                                <view class="gainsProgressBox flex-f1 center margin-top-xs">
                                    <view class="bg-red gainsProgress" :style="{'width':'80px'}"></view>
                                    <view class="bg-cb gainsProgress gainsProgressCenter" :style="{'width':'5px'}">
                                    </view>
                                    <view class="bg-green gainsProgress" :style="{'width':'15px'}"></view>
                                </view>
                            </view>
                            <!-- swiper 1 结束 -->
                        </view>
                    </swiper-item>
                </swiper>
            </view>

            <view style="width: 100vw;height: 12rpx;background-color: #FBFBFB;"></view>

            <u-row gutter="24" class="padding">
                <u-col span="12" style="color: #333333; font-weight: bolder;">
                    <text>风口热点</text>
                </u-col>
                <template v-if="card">
                    <u-col span="6">
                        <u-row class="card-box">
                            <u-col :span="12" style="padding: 0;">
                                <text class="card-title">{{card[0].title}}</text>
                            </u-col>

                            <u-col :span="12" class="margin-5">
                                <text class="rise_span">+{{card[0].up_down}}%</text>
                            </u-col>
                            <u-col span="12">
                                <image src="/static/img/zhexian.png" style="width: 280rpx;height: 140rpx;" mode="">
                                </image>
                            </u-col>

                            <u-col span="12" class="card-font margin-5">
                                {{card[1].title}} <span> +{{card[1].up_down}}% </span>
                            </u-col>

                            <u-col span="12" class="card-font margin-5">
                                {{card[2].title}} <span> +{{card[2].up_down}}% </span>
                            </u-col>

                        </u-row>
                    </u-col>

                    <u-col span="6">
                        <u-row class="card-box">
                            <u-col :span="12" style="padding: 0;">
                                <text class="card-title">{{card[3].title}}</text>
                            </u-col>

                            <u-col :span="12" class="margin-5">
                                <text class="rise_span">+{{card[3].up_down}}%</text>
                            </u-col>

                            <u-col span="12">
                                <image src="/static/img/zhexian.png" style="width: 280rpx;height: 140rpx;" mode="">
                                </image>
                            </u-col>

                            <u-col span="12" class="card-font margin-5">
                                {{card[4].title}} <span> +{{card[4].up_down}}% </span>
                            </u-col>

                            <u-col span="12" class="card-font margin-5">
                                {{card[5].title}} <span> +{{card[5].up_down}}% </span>
                            </u-col>

                        </u-row>
                    </u-col>
                </template>
            </u-row>
        </view>
        <!-- 增加个风口采集 结束 -->

        <!-- 指数 -->

        <!-- 指数 end -->
        <!-- 7x24快讯 -->
        <view class="text-white padding-sm bg_FFFFFF margin-bottom-sm">
            <view class="padding-botto-sm text-black" style="font-weight: bolder;padding: 0 12rpx;">7x24快讯</view>
            <scroll-view scroll-x="true" class="scroll-view margin-top-sm">
                <view class="text-white scroll-view-item padding-sm radius"
                    style="height: 200upx;background-color: #EB5149;" v-for="(item, index) in news2" :key="index">
                    <view class="text-cut text-lg">{{item.C.substr(0,16)}}</view>
                    <view class="text-sm desc text-cut2 margin-tb-xs" style="height: 80upx; overflow: hidden;">
                        {{item.C.substr(16,35)}}</view>
                    <view class="flex align-center">
                        <text class="flex-sub">{{item.T}}</text>
                        <text class="cu-tag sm radius text-white" style="background-color: #EB5149;">热门概念</text>
                    </view>
                </view>
            </scroll-view>
        </view>
        <!-- 7x24快讯 end -->
        <!--  动态 开始-->
        <view class='dynamicBox bg_FFFFFF'>
            <!-- 导航开始 -->
            <view class="dynamicTab start">
                <view @click="changeTab(0)" :class="tabIndex == 0?'active':''" class="tabItem">今日头条</view>
                <view @click="changeTab(1)" :class="tabIndex == 1?'active':''" class="tabItem">实时动态</view>
                <view @click="changeTab(2)" :class="tabIndex == 2?'active':''" class="tabItem">汇丰资讯</view>
                <view @click="changeTab(3)" :class="tabIndex == 3?'active':''" class="tabItem">利好消息</view>
            </view>
            <!-- 导航结束 -->
            <!-- 今日头条 开始 -->
            <view v-if="tabIndex == 0">
                <view class="dynamicList bg_FFFFFF" v-for="(item,index) in dynamic" :key="index">
                    <view class="newsBox flex justify-between" @click="goDetail(item.id)">
                        <view class="flex justify-between newsInfo flex-direction flex-sub" style="margin-left: 8upx;">
                            <view class="fo30_w500 flex-te2 text-black text-lg text-cut2">
                                {{item.title.substr(0,13)}}
                            </view>
                            <view class="text-black fz12 mb5"
                                style="display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;">
                                {{item.brief.substr(0,22)}}
                            </view>
                            <view class="cb6 fz12 mb5">
                                <text>{{item.atime}}</text>
                            </view>
                        </view>
                        <image class="newsImg" :src="item.thumb_url|| '/static/thumb.jpg'"></image>
                    </view>
                </view>
            </view>
            <!-- 今日头条 结束 -->
            <!-- 实时动态 开始 -->
            <view v-if="tabIndex == 1">
                <!-- 循环开始 -->
                <u-row gutter="12" class="padding" style="margin-top: 3px;padding-top: 10px;"
                    v-for="(item, index) in news" :key="index">
                    <span style="color: #EE515A;font-size: 14px;">{{item.T}}</span>
                    <span style="color: #333333;font-size: 14px;">{{item.C}}</span>
                    <u-line style="margin-top: 5px;color: #dcdfe6;" />
                </u-row>
                <!-- 循环结束 -->
            </view>
            <!-- 实时动态 结束 -->
            <!-- 汇丰资讯 开始 -->
            <view v-if="tabIndex == 2">
                <view class="dynamicList bg_FFFFFF" v-for="(item,index) in dynamic2" :key="index">
                    <view class="newsBox flex justify-between" @click="goDetail(item.id)">
                        <view class="flex justify-between newsInfo flex-direction flex-sub" style="margin-left: 8upx;">
                            <view class="fo30_w500 flex-te2 text-black text-lg text-cut2">
                                {{item.title.substr(0,13)}}
                            </view>
                            <view class="text-black fz12 mb5"
                                style="display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;">
                                {{item.brief.substr(0,22)}}
                            </view>
                            <view class="cb6 fz12 mb5">
                                <text>{{item.atime}}</text>
                            </view>
                        </view>
                        <image class="newsImg" :src="item.thumb_url|| '/static/thumb.jpg'"></image>
                    </view>
                </view>
            </view>
            <!-- 汇丰资讯 结束 -->
            <!-- 利好消息 开始 -->
            <view v-if="tabIndex == 3">
                <!-- 循环开始 -->
                <u-row gutter="12" class="padding" style="margin-top: 3px;padding-top: 10px;"
                    v-for="(item, index) in news4" :key="index">
                    <span style="color: #EE515A;font-size: 14px;">{{item.T}}</span>
                    <span style="color: #333333;font-size: 14px;">{{item.C}}</span>
                    <u-line style="margin-top: 5px;color: #dcdfe6;" />
                </u-row>
                <!-- 循环结束 -->
            </view>
            <!-- 利好消息 结束 -->
        </view>
        <!--  动态 结束-->

        <!-- 机构追涨 开始-->
        <view class="new_zz">
            <image @tap="zhuizhang" style="width: 70upx; height: 153upx;" :src="show_zz" @error="imageError">
            </image>
        </view>
        <!-- 机构追涨 结束 -->


    </view>
</template>

<script>
    import searchHead from "@/component/searchHead/searchHead.vue"
    import dateView from "@/component/date/date.vue"
    export default {
        components: {
            searchHead,
            dateView,
        },
        data() {
            return {
                //hackReset:true,
                appimg: '',
                appText: 'APP下载',
                show_zz: '/static/img/zz.png',
                NewSharesData: [
                    // {name:"超级股票1",code:"123123"},
                    // {name:"超级股票2",code:"123123"},
                    // {name:"超级股票3",code:"123123"},
                    // {name:"超级股票4",code:"123123"}
                ],
                showTip: {
                    // v1:20,
                    // v2:30,
                    // sv1:'20%',
                    // sv2:'20%',
                    // sv3:'20%'
                },
                card: false,
                // 顶栏
                statusBarHeight: getApp().globalData.statusBarHeight, //状态栏高度
                // 幻灯片 跑马灯
                tabIndex: 0,
                indicatorDots: true,
                autoplay: true,
                interval: 2000,
                duration: 500,
                // 新增的
                appDownUrl: '',
                qqserver: "",
                showAddToHome: false,
                // 资讯与动态
                news: [],
                news2: [],
                news3: [],
                news4: [],
                dynamic: [],
                dynamic2: [],
                // 指数展示
                shares: [],
                shangZheng: {},
                chuangYe: {},
                shenZheng: {},
                // 股票搜索
                where: "",
            };
        },
        methods: {
            // 图片错误 
            imageError: function() {
                // 留空
            },
            // 追涨
            zhuizhang: function() {
                uni.navigateTo({
                    url: '/pages/OtherPages/zhuiZhang'
                })
            },
            // 跳转页面
            tonavigateTo(url) {
                console.log(url)
                uni.navigateTo({
                    url: url
                })
            },
            // 空 涨 函数
            createLine() {
                let v1 = Math.ceil(Math.random() * 500)
                let v2 = Math.ceil(Math.random() * 500)
                let sv1 = Math.ceil((v1 / (v1 + v2)) * 0.8 * 100)
                let sv2 = 80 - sv1
                this.showTip.v1 = v1;
                this.showTip.v2 = v2;
                this.showTip.sv1 = sv1 + '%';
                this.showTip.sv2 = sv2 + '%';
                this.showTip.sv3 = '15%';
            },
            // 去交易 因为之前是那个 导航内容
            toTrade() {
                uni.navigateTo({
                    url: '/pages/trading/buy'
                })
            },
            // 新增函数
            toInfo(data) {
                uni.navigateTo({
                    url: "/pages/gzQiYe/sharesInfo?name=" + data.N + "&code=" + data.FS,
                })
            },
            // 切换tab
            changeTab(index) {
                this.tabIndex = index
            },
            // 幻灯片 开始
            changeIndicatorDots(e) {
                this.indicatorDots = !this.indicatorDots
            },
            changeAutoplay(e) {
                this.autoplay = !this.autoplay
            },
            intervalChange(e) {
                this.interval = e.detail.value
            },
            durationChange(e) {
                this.duration = e.detail.value
            },
            // 幻灯片 结束
            // 今日 新股 提醒
            getNewSharesOne: function() {
                let week = new Date().getDay()
                let showAgain = this.$SysCache.get("showAgainFlag1")

                if (showAgain != week) {
                    this.$Request.get(this.$api.index.getNewShares).then(res => {
                        if (res.code == 0) {
                            if (res.data.length > 0) {
                                var content = "今日新股：";
                                for (var i = 0; i < res.data.length; i++) {
                                    content += res.data[i].name + "，申购代码：" + res.data[i].code;
                                    if (i == res.data.length - 1) {
                                        content += "。";
                                    } else {
                                        content += "；";
                                    }
                                }
                                content += "详细点击查看";
                                uni.showModal({
                                    title: "新股申购提醒",
                                    content: content,
                                    confirmText: "去打新",
                                    cancelText: "今日不再提示",
                                    success: (res) => {
                                        if (res.confirm) {
                                            uni.navigateTo({
                                                url: "/pages/public/newShare/newShare?tabIndex=1",
                                            })
                                        } else if (res.cancel) {
                                            this.$SysCache.put("showAgainFlag1", week);
                                        }
                                    }
                                })
                            }
                        }
                    })
                }
            },
            // 获取 各种行情  指数 行情
            getIndexShares: function() {
                this.$Request.get(this.$api.index.getIndexShares).then(res => {
                    if (res.code == 999) {
                        uni.navigateTo({
                            url: "/pages/public/login/login",
                        })
                        return
                    }
                    this.shares = res.data;
                    this.shangZheng = this.shares[0];
                    this.chuangYe = this.shares[1];
                    this.shenZheng = this.shares[2];
                })
            },
            // 新股查询
            getNewShares: function() {
                let data = {
                    type: 3
                }
                this.$Request.post(this.$api.index.getNewShares, data).then(res => {
                    if (res.code == 0 && res.data.length > 0) {
                        this.NewSharesData = res.data
                    }
                })
            },
            // 中签 提醒
            getZhongQian: function() {
                this.$Request.get(this.$api.index.getZhongQian).then(res => {
                    if (res.code == 0) {
                        if (res.data.length > 0) {
                            var content = "恭喜中签：";
                            for (var i = 0; i < res.data.length; i++) {
                                content += res.data[i].sname + "，申购代码：" + res.data[i].scode;
                                if (i == res.data.length - 1) {
                                    content += "。";
                                } else {
                                    content += "；";
                                }
                            }
                            content += "详细点击查看";
                            uni.showModal({
                                title: "新股中签提醒",
                                content: content,
                                confirmText: "查看",
                                cancelText: "知道了",
                                success: (res) => {
                                    if (res.confirm) {
                                        uni.navigateTo({
                                            url: "/pages/member/myShare",
                                        })
                                    } else if (res.cancel) {

                                    }
                                }
                            })
                        }
                    }
                })
            },
            // 添加到屏幕上
            addToHome: function() {
                this.showAddToHome = false
                addToHomescreen()
            },
            // app 下载
            downApp: function() {
                //#ifdef H5
                window.location.href = this.appDownUrl
                //#endif
                //#ifndef H5
                this.tonavigateTo('/pages/member/setUp')
                //#endif
            },
            //客服中心
            customer: function() {
                if (this.qqserver) {
                    //#ifdef H5
                    window.location.href = this.qqserver;
                    //#endif
                    //#ifndef H5
                    plus.runtime.openURL(this.qqserver);
                    //#endif
                } else {
                    window.location.href = "https://www.google.com";
                }
            },
            // 获取新闻 资讯
            getNews: function() {
                let data = {
                    type: 1
                }
                this.$Request.post(this.$api.index.getNews, data).then(res => {
                    this.news = res.data;
                })
            },
            getNews2: function() {
                let data = {
                    type: 6
                }
                this.$Request.post(this.$api.index.getNews, data).then(res => {
                    this.news2 = res.data;
                })
            },
            getNews3: function() {
                let data = {
                    type: 9
                }
                this.$Request.post(this.$api.index.getNews, data).then(res => {
                    this.news3 = res.data;
                })
            },
            getNews4: function() {
                let data = {
                    type: 2
                }
                this.$Request.post(this.$api.index.getNews, data).then(res => {
                    this.news4 = res.data;
                })
            },
            // 获取动态 后台编辑的
            getDynamic: function() {
                let data = {
                    type: 1
                }
                this.$Request.post(this.$api.index.getDynamic, data).then(res => {
                    this.dynamic = res.data;
                })
            },
            getDynamic2: function() {
                let data = {
                    type: 2
                }
                this.$Request.post(this.$api.index.getDynamic, data).then(res => {
                    this.dynamic2 = res.data;
                })
            },
            // 文章详情
            goDetail: function(id) {
                let url = '/pages/public/arcticle/detail?id=' + id
                uni.navigateTo({
                    url: url
                })
            },
            // 获取 通知
            getFirstNotice: function() {
                this.$Request.get(this.$api.index.getFirstNotice).then(res => {
                    if (res.code == 0) {
                        uni.showModal({
                            title: res.data.title,
                            content: res.data.details,
                            confirmText: "确认",
                            cancelText: "知道了",
                            success: (res) => {
                                if (res.confirm) {} else if (res.cancel) {}
                            }
                        })
                    }
                })
            },
            // 获取风口热点
            hotspot_list() {
                this.$Request.get(this.$api.index.hotspot_list).then(res => {
                    if (res.code == 0) {
                        this.card = res.data
                    }
                })
            },
        },
        onLoad: function() {
            //#ifdef H5
            this.appimg = "/static/images/newIcon/downloads.png"
            this.appText = "APP下载"
            //#endif
            //#ifndef H5
            this.appimg = "/static/images/newIcon/set.png"
            this.appText = "账号设置"
            //#endif

            //#ifdef H5
            this.showAddToHome = true
            //#endif
            this.$Request.get(this.$api.index.appDownUrl).then(res => {
                if (res.data.appDownUrl) {
                    this.appDownUrl = res.data.appDownUrl;
                }
                if (res.data.qqserver) {
                    this.qqserver = res.data.qqserver;
                }
            })
            this.$Request.get(this.$api.index.userInfo).then(res => {
                if (res.qqserver) {
                    this.qqserver = res.qqserver;
                }
            })
            // 新股提示
            var that = this;
            setTimeout(() => {
                that.getNewSharesOne();
            }, 5000);
        },
        onShow() {
            this.getNews()
            this.getNews2()
            this.getNews3()
            this.getNews4()
            this.getDynamic()
            this.getDynamic2()
            this.getNewShares()
            this.getZhongQian()
            this.getIndexShares()
            this.hotspot_list()
            this.createLine()
            this.getFirstNotice()
        }
    }
</script>
<style lang="scss" scoped>
    @import "./index.scss";

    .ceiling {
        background-color: rgb(18, 22, 31);
    }

    .nav {
        font-weight: 400;
    }

    .AD {
        position: relative;

        .AD-bg {}

        .AD-txt {
            .item {
                // margin-bottom: 22rpx;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }

            position: absolute;
            top: 20rpx;
            // font-size: 26rpx;
            color: #666666;
            width: 400rpx;
            left: 250rpx;

            .sp {
                font-size: 22rpx;
                color: #ED1C24;
                display: inline-block;
                margin-right: 20rpx;
                border: 1px solid #ED1C24;
                padding: 2rpx 16rpx;
                border-radius: 16rpx;
            }
        }
    }

    .notice {
        // position: absolute;
        top: 0;
        width: 100vw;

        .item {
            color: #666666 !important;
            background-color: #FFFFFF !important;
            padding: 10rpx !important;
            overflow: hidden !important;
            padding: 0 !important;
            border: 0 !important;
            position: relative;

            &::after {
                z-index: 999;
                position: absolute;
                content: '';
                width: 100%;
                height: 10px;
                background-color: #FFFFFF;
                bottom: -20rpx;
                left: 0;
            }
        }

    }

    .volumeBox {
        background-color: #FFFFFF;
        padding: 20rpx 25rpx;
    }

    .padding {
        padding-left: 24upx;
        padding-right: 24upx;
    }

    .icon-Box .iconImg {
        width: 80rpx;
        height: 80rpx;
    }

    uni-swiper {
        height: 130px;
    }

    // 7x24
    .scroll-view {
        white-space: nowrap;
        width: 100%;

        .scroll-view-item {
            display: inline-block;
            width: 480upx;
            background-color: #000;
            margin-right: 30upx;

            .desc {
                white-space: normal;
            }
        }
    }

    .exponent-item {
        border-radius: 20rpx;

        &:nth-of-type(2n) {
            margin: 0 20upx;
        }
    }

    .card-title {
        font-size: 18px;
        font-weight: bold;
        color: #A8AFC2;
    }

    .card-box {
        margin-top: 15px;
        box-sizing: border-box;
        border: 1px solid #A8AFC2;
        padding: 20rpx;
        border-radius: 5px;
    }

    .rise_span {
        color: #FFFFFF;
        background-color: #fd221b;
        border-radius: 10rpx;
        box-sizing: border-box;
        padding: 1px;
        margin-top: 10rpx;
        font-size: 12px;
    }

    .card-font {
        padding: 0 !important;
        font-size: 12px;
        color: #A8AFC2;

        span {
            color: #fd221b;
            padding-left: 2px;
            font-weight: bold;
        }
    }

    .new_zz {
        position: fixed;
        right: 6upx;
        top: 42%;
    }

    .myRiLi {
        z-index: 666;
        position: fixed;
        right: 6upx;
        top: 164px;
    }
</style>
